import Taro, { Component } from '@tarojs/taro'
import { Swiper, SwiperItem, Image, View, Text,Button  } from '@tarojs/components'
import '../../assets/common.scss'
import CommonJs from '../../utils/common'
import Footer from '../index/footer'

import cat01 from '../../assets/kedouimg01/tdbuser5.png'
import cat02 from '../../assets/kedouimg01/daili3.png'
import cat03 from '../../assets/kedouimg01/mdgl.png'
import cat04 from '../../assets/kedouimg01/vip3.png'

export default class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      reslut:[],
      tjinfo:[],
      qunlist:[],
      total:0,
      catname:'',
      noshow:CommonJs.getshow(),
		  noshow1:CommonJs.getshow(),
		  appmark:CommonJs.getmark(),
		  webinfo:Taro.getStorageSync('webinfo')
    }
  }
  config = {
    navigationBarTitleText:'加载中'
  }

  componentWillMount () {
	if(this.state.appmark=='xjzb'){
		Taro.setNavigationBarTitle({
			title:'共享圈'
		  })
	}
	else{
		Taro.setNavigationBarTitle({
			title:'社群'
		  })
	}
  	Taro.setNavigationBarColor({
		    frontColor: '#ffffff',
		    backgroundColor: '#043581',
		    animation: {
		        duration: 400,
		        timingFunc: 'easeIn'
		    }
		})
  	
  	this.getdate()
  	this.getqadd()
  	this.getshow()
  	if(this.state.webinfo){
  		this.getqunbyid(30,'公司')
  	}
  	else{
  		this.getqunbyid(31,'家人')
  	}
  	wx.showShareMenu({
	    withShareTicket: true,
	    menus: ['shareAppMessage']
	  });
  }
  componentDidShow () {
		
  }
  componentDidUpdate () {

  }
  onShareTimeline(res) {
  	
    var share_title = "共享圈";
    var goods_id = '118';
    let shareImg = '';
    var _this = this;
   
    query = 'id=' + goods_id;
    return {
      title: share_title,
      query: query,
      imageUrl: shareImg,
      success: function (res) {
        // 转发成功
      },
      fail: function (res) {
        // 转发失败
      }
    }
  }
	getdate(){
    var _this=this
    const accountInfo = Taro.getAccountInfoSync();
		const appid=accountInfo.miniProgram.appId;
    CommonJs.ajaxRequest('/cluster/myClustersall?appId='+appid,'','GET',function(res){
     
      var res=res.content;
      var total=0;
      for(var i=0;i<res.length;i++){
      	total=total+parseInt(res[i].sharingFund)
      }
       _this.setState({
        reslut:res,
        total:total
      })
    })
  }
	
	getqadd(){
		var _this=this
		var url='/cluster/getNewCircle'
		CommonJs.ajaxRequest(url,'','GET',function(res){
      _this.setState({
        tjinfo: res.content
      })
    })
	}
	getnav(id, types){
		if(this.state.noshow!=this.state.noshow1){
			var dateinfo=Taro.getStorageSync('dateinfo')
			if(!dateinfo){
				dateinfo={};
			}
			dateinfo.qid=id
			Taro.setStorage({key:'dateinfo',data:dateinfo})
	   	this.$preload({
	      'chatRoomTypeId':5
	    });
	    CommonJs.openTo('/pages/chat/syslist?scene='+id);
    }
  }
	getqunbyid(id,name){
		var _this=this
    //var url='/cluster/queryPageDataCount?categoryOfLinkTemplateId='+id+'&pageSize=1000';
    const accountInfo = Taro.getAccountInfoSync();
		const appid=accountInfo.miniProgram.appId;
    var url='/cluster/myClustersall?categoryOfLinkTemplateId='+id+'&pageSize=1000&appId='+appid;
    CommonJs.ajaxRequest(url,'','GET',function(res){
      _this.setState({
        qunlist: res.content,
        catname:name
      })
    })
	}
	getshow(){
  	var url='/advert/papi/v1.9/advert/advert/state'
  	var _this=this
  	CommonJs.ajaxRequest(url,'','GET',function(res){
		_this.setState({
	      noshow:res.data.type
	    })
  	},"wfw")
  }
  render () {
  	const reslut=this.state.reslut;
  	const tjinfo=this.state.tjinfo;
	const qunlist=this.state.qunlist;
	const appmark=this.state.appmark
    return (
    	<View className='wgmpage footerpage'>
    		<View className='gxq-box'>
    			<View className='gxq-tj' style='background-color:#043581'>
    				<View className='gxq-text'>总{appmark=='xjzb'?'UC':'共享金'}</View>
    				<View className='gxq-num'>{this.state.total/100}</View>
    				<View className='gxq-mytj'>
    					<View className='gxq-mytj-li'>
    							<Text className='gxq-mytj-text' style={appmark=='xjzb'?'':'display:none'}>我的共享圈</Text>
    							<Text className='gxq-mytj-text' style={appmark=='xjzb'?'display:none':''}>我的社群</Text>
    							<Text className='gxq-mytj-num'>{reslut.length}</Text>
    					</View>
    					<View className='gxq-mytj-li'>
    							<Text className='gxq-mytj-text' style={appmark=='xjzb'?'':'display:none'}>新增共享圈</Text>
    							<Text className='gxq-mytj-text' style={appmark=='xjzb'?'display:none':''}>新增社群</Text>
    							<Text className='gxq-mytj-num'>{tjinfo.length}</Text>
    					</View>
    				</View>
    			</View>
    			<View className='gxq-quanzi'>
    				<View className='typedl'  onClick={this.getqunbyid.bind(this,31,'家人')}  style={this.state.webinfo?"display:none":''}>
	    				<View className='typedt'><Image className="img" mode="widthFix" src={cat01}></Image></View>
	    				<View className='typedd'>
	    					<View className='typeddh3'>家人</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'':'display:none'}>家人采购,我买单,与家人共享UC</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'display:none':''}>家人采购,我买单,与家人共享收益金</View>
	    				</View>
	    			</View>
	    			<View className='typedl' onClick={this.getqunbyid.bind(this,30,'公司')}>
	    				<View className='typedt'><Image className="img" mode="widthFix" src={cat02}></Image></View>
	    				<View className='typedd'>
	    					<View className='typeddh3'>公司</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'':'display:none'}>企业调度不用愁,与您的员工共享UC余额</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'display:none':''}>企业调度不用愁,与您的员工共享收益金</View>
	    				</View>
	    			</View>
	    			<View className='typedl' onClick={this.getqunbyid.bind(this,32,'商户')}>
	    				<View className='typedt'><Image className="img" mode="widthFix" src={cat03}></Image></View>
	    				<View className='typedd'>
	    					<View className='typeddh3'>商户</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'':'display:none'}>将您的UC分享给没有UC的会员</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'display:none':''}>将您的收益金分享给您的的会员</View>
	    				</View>
	    			</View>
	    			<View className='typedl' onClick={this.getqunbyid.bind(this,29,'商圈')} style={this.state.webinfo?"display:none":''}>
	    				<View className='typedt'><Image className="img" mode="widthFix" src={cat04}></Image></View>
	    				<View className='typedd'>
	    					<View className='typeddh3'>商圈</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'':'display:none'}>产业链互助,购买商圈产品,共享商圈内所有UC总和,每人10倍使用</View>
	    					<View className='typeddspan' style={appmark=='xjzb'?'display:none':''}>产业链互助,购买商圈产品,共享商圈内所有收益金</View>
	    				</View>
	    			</View>
    			</View>
    			<View className='gxq-quanzi gxq-my'>
    					<View className='gxq-my-tit' style={appmark=='xjzb'?'':'display:none'}>{this.state.catname}共享圈列表</View>
    					<View className='gxq-my-tit' style={appmark=='xjzb'?'display:none':''}>{this.state.catname}社群列表</View>
    					<View className='nodate' style={qunlist.length==0?'':'display:none'}>该分类下暂无圈子</View>
    					{qunlist.map((item, index) => (
    					<View className='qun-lists' onClick={this.getnav.bind(this,item.id,1)}>
	              <View className='qun-toxnli'>
	                <View className='qun-lfimg'>
	                  <Image className='qun-userg' mode='scaleToFill' src={item.photo ? item.photo : CommonJs.getlogo}></Image>
	                </View>
	                <View className='qun-lfinfo'>
	                  <View className='qun-inyi'>
	                    <Text className='qun-botn'>{item.name}（{item.clusterCount}）人</Text>
	                    <Text className='qun-gntn'>{item.note}</Text>
	                  </View>
	                  <View className='qun-loyan'>{appmark=='xjzb'?'UC':'共享金'}:{item.sharingFund/100}元</View>
	                </View>
	              </View>
	            </View>
	            ))}
    			</View>
    			<View className='gxq-quanzi gxq-my'>
    					<View className='gxq-my-tit' style={appmark=='xjzb'?'':'display:none'}>我加入的共享圈</View>
    					<View className='gxq-my-tit' style={appmark=='xjzb'?'display:none':''}>我加入的社群</View>
    					<View className='nodate' style={reslut.length==0?'':'display:none'}>暂未加入共享圈</View>
    					{reslut.map((item, index) => (
    					<View className='qun-lists' onClick={this.getnav.bind(this,item.id,1)}>
	              <View className='qun-toxnli'>
	                <View className='qun-lfimg'>
	                  <Image className='qun-userg' mode='scaleToFill' src={item.photo ? item.photo : CommonJs.getlogo}></Image>
	                </View>
	                <View className='qun-lfinfo'>
	                  <View className='qun-inyi'>
	                    <Text className='qun-botn'>{item.name}（{item.clusterCount}）人</Text>
	                    <Text className='qun-gntn'>{item.note}</Text>
	                  </View>
	                  <View className='qun-loyan'>共享金:{item.sharingFund/100}元</View>
	                </View>
	              </View>
	            </View>
	            ))}
    			</View>
    		</View>
				<Footer porpNav="3"></Footer>
      </View>
    )
  }
}
